<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>取非行间的样式</title>
	<style type="text/css">
		#box{
			width: 500px;
			height: 200px;
			border: 5px solid #000;
			background-color: red;
		}
	</style>
	<script type="text/javascript">
		window.onload=function(){
           var objectBox=document.getElementById('box');
           //alert(objectBox);
           //currentStyle 非IE不支持，
           //不兼容FF Chrome
           //alert(objectBox.currentStyle.width);

           //兼容FF Chrome写法
           //getComputedStyle(obj,null)
           //第二个参数完全不起作用，可以随意填入
           //alert(getComputedStyle(objectBox,true).width);
           
         
           //同时兼容两种方式的写法
           if (objectBox.currentStyle) {
           	 //IE 为真
              alert(objectBox.currentStyle['background-color']);
           }else{
           	 //ff chrome 为假
           	  alert(getComputedStyle(objectBox,true).height);
           }

		}
	</script>
</head>
<body>
	<div id="box"></div>
</body>
</html>